﻿<div class="row">
    <div class="col-xs-12">
        <div class="box">
            <button class="btn btn-block btn-default" data-ng-click="newProject();" 
                    data-ng-if="userType == 1 || userType == 4">New project</button>
            <div class="box-header">
                <h3 class="box-title">List project</h3>
                <div class="box-tools">
                    <div class="input-group">
                        <input type="text" placeholder="Search" 
                               style="width: 150px;" class="form-control input-sm pull-right" name="table_search"
                               data-ng-model="searchKey">
                        <div class="input-group-btn">
                            <button class="btn btn-sm btn-default"><i class="fa fa-search"></i></button>
                        </div>
                    </div>
                </div>
            </div><!-- /.box-header -->
            <div class="box-body table-responsive no-padding">
                <table class="table table-hover">
                    <tbody>
                        <tr>
                            <th>No</th>
                            <th>Name</th>
                            <th>Desc</th>
                            <th>Student</th>
                            <th>Supervisor</th>
                            <th>Second marker</th>
                        </tr>
                        <tr data-ng-repeat="p in projects | filter : searchKey" data-ng-click="selectProject(p)" style="cursor: pointer">
                            <td>{{$index + 1}}</td>
                            <td>{{p.name}}</td>
                            <td data-ng-bind-html="p.desc"></td>
                            <td>{{p.studentName}}</td>
                            <td>{{p.superVisorName}}</td>
                            <td>{{p.secondMarkerName}}</td>
                        </tr>
                    </tbody>
                </table>
            </div><!-- /.box-body -->
        </div><!-- /.box -->
    </div>
</div>
<div class="row" data-ng-if="project">
    <div class="col-md-12">
        <!-- general form elements disabled -->
        <div class="box box-warning">
            <div class="box-header">
                <h3 class="box-title">Infomation</h3>
            </div><!-- /.box-header -->
            <form role="form" data-ng-submit="saveProject(project)">
                <div class="box-body">
                    <!-- text input -->
                    <div class="form-group">
                        <label>Name</label>
                        <input type="text" class="form-control" placeholder="Name ..." data-ng-model="project.name">
                    </div>
                    <div class="form-group">
                        <label>Descripttion</label>
                        <text-angular data-ng-model="project.desc" placeholder="Desc ..."></text-angular>
                    </div>
                    <div class="form-group">
                        <label>File result</label>
                        <input type="text" class="form-control" placeholder="File url ..." data-ng-model="project.file">
                    </div>
                    <div class="form-group" data-ng-if="userType != 1">
                        <label>Student</label>
                        <ui-select ng-model="project.selectedStudent" style="width: 100%;" ng-disabled="userType != 4">
                            <ui-select-match placeholder="Student...">
                                {{$select.selected.userName}}
                            </ui-select-match>
                            <ui-select-choices repeat="item in students | filter: $select.search"
                                               refresh="refreshStudent($select.search)"
                                               refresh-delay="333">
                                <div ng-bind-html="item.userName | highlight: $select.search"></div>
                            </ui-select-choices>
                        </ui-select>
                    </div>
                    <div class="form-group">
                        <label>Supervisor</label>
                        <ui-select ng-model="project.selectedSupervisor" style="width: 100%;" ng-disabled="userType != 4">
                            <ui-select-match placeholder="Supervisor...">
                                {{$select.selected.userName}}
                            </ui-select-match>
                            <ui-select-choices repeat="item in supervisors | filter: $select.search"
                                               refresh="refreshSupervisor($select.search)"
                                               refresh-delay="333">
                                <div ng-bind-html="item.userName | highlight: $select.search"></div>
                            </ui-select-choices>
                        </ui-select>
                    </div>
                    <div class="form-group">
                        <label>Second marker</label>
                        <ui-select ng-model="project.selectedSecondMarker" style="width: 100%;" ng-disabled="userType != 4">
                            <ui-select-match placeholder="Second marker...">
                                {{$select.selected.userName}}
                            </ui-select-match>
                            <ui-select-choices repeat="item in secondMarkers | filter: $select.search"
                                               refresh="refreshSecondMarkers($select.search)"
                                               refresh-delay="333">
                                <div ng-bind-html="item.userName | highlight: $select.search"></div>
                            </ui-select-choices>
                        </ui-select>
                    </div>
                </div><!-- /.box-body -->
                <div class="box-footer" data-ng-if="userType == 1 || userType == 4">
                    <button type="submit" class="btn btn-primary">Save</button>
                </div>
            </form>
        </div><!-- /.box -->
    </div>
</div>